@charset "utf-8";
.nav-left{width: 36px;
        height: 100%;
        background: #565656;
        position: fixed;
        right: 0;
        z-index: 999;
        }
.divcss5{ position:relative;width:27px; height:50px;margin:0 auto;
        margin-top: 15px;} 
.divcss5 a,.divcss5 span{display:none; text-decoration:none;}
.divcss5:hover{cursor:pointer} 
.divcss5:hover a.now{cursor:pointer; position:absolute; top:0; width:100%; height:100%;
 z-index:1000; left:0; display:block;}
.divcss5:hover span{ display:block;position:absolute; bottom:3px;color:#ffffff;width:116px;left: -116px; 
z-index:1000;height:50px; line-height:50px;filter:alpha(opacity=60);-moz-opacity:0.5;opacity: 0.5;border-radius: 5px;
    background: #000000;text-align: center;font-size: 12px;}
 


.advisement{
    width: 1339px;
    margin: 0 auto;
    margin-top: 52px;    

  .main .view{ width:316px; height:316px; overflow:hidden; position:relative; float:left;}
.main .view2{ width:670px; height:316px; overflow:hidden; position:relative; float:left;margin-left: 10px;}

.main .hover{
    width:316px; background:rgba(0, 0 ,0 ,0.5); position:absolute; top:100px; left:0; text-align:center; color:#fff;
    transform:rotate(55deg);
    -moz-transform:rotate(55deg);
    -webkit-transform:rotate(55deg);
    transition:all 0.5s;
    -moz-transition:all 0.5s;
    -webkit-transition:all 0.5s;
    overflow:hidden; height:0; z-index:4000;}

.main .hover h3{color:#fff; border-bottom:2px solid rgba(255, 255 ,255, 0.5); padding-bottom:10px;padding-top: 10px;}
.main .hover p{line-height: 130%;padding: 10px 0;}
.main .view:hover .hover{height:120px;transform:rotate(0deg);-moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);}

.main .view:before{
    content:""; position:absolute; top:-200px; right:0px;width:360px; height:360px; background:rgba( 150, 50, 100,0.5);
    transform:rotate(55deg) translateX(60px);
    -moz-transform:rotate(55deg) translateX(60px);
    -webkit-transform:rotate(55deg) translateX(60px);
    transform-origin:100% 0%;
    -moz-transform-origin:100% 0%;
    -webkit-transform-origin:100% 0%;
    transition:all 0.5s ease 0.3s;
    -moz-transition:all 0.5s ease 0.3s;
    -webkit-transition:all 0.5s ease 0.3s;

}
.main .view:hover:before{ top:0;}
.main .view:after{
    content:""; position:absolute;bottom:-200px; left:0px;width:360px; height:360px; background:rgba( 150, 50, 100,0.5);
    transform:rotate(55deg) translateX(-60px);
    -moz-transform:rotate(55deg) translateX(-60px);
    -webkit-transform:rotate(55deg) translateX(-60px);
    transform-origin:0% 100%;
    -moz-transform-origin:0% 100%;
    -webkit-transform-origin:0% 100%;
    transition:all 0.5s ease 0.3s;
    -moz-transition:all 0.5s ease 0.3s;
    -webkit-transition:all 0.5s ease 0.3s;
}
.main .view:hover:after{ bottom:0px;}

.main .hover2{
    width:670px; background:rgba(0, 0 ,0 ,0.5); position:absolute; top:100px; left:0; text-align:center; color:#fff;
    transform:rotate(55deg);
    -moz-transform:rotate(55deg);
    -webkit-transform:rotate(55deg);
    transition:all 0.5s;
    -moz-transition:all 0.5s;
    -webkit-transition:all 0.5s;
    overflow:hidden; height:0; z-index:4000;}

.main .hover2 h3{color:#fff; border-bottom:2px solid rgba(255, 255 ,255, 0.5); padding-bottom:10px;padding-top: 10px;}
.main .hover2 p{line-height: 130%;padding: 10px 0;}
.main .view2:hover .hover2{height:120px;transform:rotate(0deg);-moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);}

.main .view2:before{
    content:""; position:absolute; top:-200px; right:0px;width:360px; height:360px; background:rgba( 150, 50, 100,0.5);
    transform:rotate(55deg) translateX(60px);
    -moz-transform:rotate(55deg) translateX(60px);
    -webkit-transform:rotate(55deg) translateX(60px);
    transform-origin:100% 0%;
    -moz-transform-origin:100% 0%;
    -webkit-transform-origin:100% 0%;
    transition:all 0.5s ease 0.3s;
    -moz-transition:all 0.5s ease 0.3s;
    -webkit-transition:all 0.5s ease 0.3s;

}}
.main .view2:hover:before{ top:0;}
.main .view2:after{
    content:""; position:absolute;bottom:-200px; left:0px;width:360px; height:360px; background:rgba( 150, 50, 100,0.5);
    transform:rotate(55deg) translateX(-60px);
    -moz-transform:rotate(55deg) translateX(-60px);
    -webkit-transform:rotate(55deg) translateX(-60px);
    transform-origin:0% 100%;
    -moz-transform-origin:0% 100%;
    -webkit-transform-origin:0% 100%;
    transition:all 0.5s ease 0.3s;
    -moz-transition:all 0.5s ease 0.3s;
    -webkit-transition:all 0.5s ease 0.3s;
}
.main .view2:hover:after{ bottom:0px;}

.brand-logo{
    width: 1339px;
    margin: 0 auto;
    margin-top: 50px;
        ul{
            li{
                float: left;
                border-left: 1px solid #b5b5b5;
                width: 130px;
                height: 104px;
                text-align: center;
                transition: all 2s; 
              }
            li:first-child{
                border-left:none;
            }
            .brand-logo-pic1{
                background-image: url(../img/index/brand-pic2.png);
                background-repeat: no-repeat;
                width: 98px;
                height: 41px;
                margin: 0 auto;
                margin-top: 16px;
                line-height: 20px;
                    img{width: 100%;
                        height: 100%;}
            }
             .brand-logo-pic{
                background-image: url(../img/index/brand-pic1.png);
                background-repeat: no-repeat;
                width: 98px;
                height: 41px;
                margin: 0 auto;
                margin-top: 16px;
                line-height: 20px;
                 
                    img{width: 100%;
                        height: 100%;}
            }
            span{font-size: 12px;
            line-height: 48px;}
            li:hover{
               background: #313131;
               color: #EFEFEF;
                       
            .brand-logo-pic:hover{
               background: url(../img/index/login-pic03.png);
            } 
            .brand-logo-pic1:hover{
                background: url(../img/index/brand-pic4.png);
            }}
            
        }
}
.index-contant{
    width: 1339px;
    margin: 0 auto;
    margin-top: 50px;
        table{ width: 100%;
                height: 1249px; 
                tr td {padding-left: 10px;
                   h4{font-size: 12px; 
                        line-height:30px;
                        color: #707070; 
                        font-weight: 500;
                        display: block;
                        margin-left: 20px;
                        
                        }
                    p{font-size: 10px;
                      color: #707070;
                      margin-right: 20px;
                      margin-left: 20px;}
                .index-contant-first{
                    width: 315px;
                    height: 826px;
                    background: #FFFFFF;
                        .len{ width: 315px;
                            height: 738px;
                            img{width: 100%; height: 100%;}
                        }}
                .index-contant-third{
                    width: 650px;
                    height: 403px;
                    background: #FFFFFF;
                       .wid{ width: 650px;
                            height: 315px;
                                img{width: 100%; height: 100%;}
                                }}
                  .index-contant-second{
                    width: 315px;
                    height: 403px;
                    background: #FFFFFF;
                        .normal{ width: 315px;
                            height: 315px;
                                img{width: 100%; height: 100%;}              
                    }}
                 }
        
                  td:hover{ 
                      animation: pic1 800ms ease-out infinite alternate;
                       box-shadow: 0 0 5px;
                      }
}}
.middle-banner{
    width: 1339px;
    height: 120px;
    margin: 0 auto;
    margin-top: 42px;
    img{width:100%;height: 100%;}   
}

.stear-one{
    width: 1339px;
    height: 28px;
    margin: 0 auto;
    border-bottom: 1px solid  #a5643c;
    margin-top: 50px;
    ul{float: right;
        
        li{
            float: right;
            line-height: 28px;
            padding-right: 20px;
            a{font-size: 12px;
            color: #535353;}
             }
        
    }
    span{
        display: block;
        font-size: 12px;
        width: 240px;
        height: 26px;
        color: #535353;
        line-height: 26px;
        border-bottom: 2px solid #a5643c;
        a{background: #a5643c; 
        float: left;
        color: #faf7f6;
        display: block;
        width: 90px;
        text-align: center;
        margin-right: 15px;
       
        }
    }
}
.floor-one-contant{
    width: 1339px;
    height: 474px;
    margin: 0 auto;
    margin-top: 22px;
    background: #FFFFFF;
    table{width: 1339px;
        height: 474px;
        tr td{ width: 266px;
            border: 1px solid #f1f1f1;
                div{height: 134px;width: 564;
                 img{display:block;margin: 0 auto;padding-top: 20px;vertical-align: bottom;}}
               div:not(:first-child):hover{
                        animation: pic2 800ms ease-out infinite alternate;
               }  
                p{font-size: 16px; margin-left: 18px;}
                span{color: #A5643C;font-size: 12px; margin-left: 18px;}
            } 
           
                .own{vertical-align: top;
                    .floor1{width: 266px;
                             height: 355px;
                            img{width: 100%; height: 100%;padding: 0;}}
                    .floor1:hover:default{}
        }
                
          .comform{width: 266px;height: 118px; color:#EFEFEF;background: #A5643C;
            h3{display: block;margin: 0 auto;width: 118px;line-height: 40px;padding-top: 15px;}
           
          } 
    
    }
}
.stear-two{
    width: 1339px;
    height: 28px;
    margin: 0 auto;
    border-bottom: 1px solid  #607591;
    margin-top: 50px;
    ul{float: right;
        
        li{
            float: right;
            line-height: 28px;
//          background: red;
            padding-right: 20px;
            a{font-size: 12px;
            color: #535353;}
             }
        
    }
    span{
        display: block;
        font-size: 12px;
        width: 240px;
        height: 26px;
        color: #535353;
        line-height: 26px;
        border-bottom: 2px solid #607591;
        a{background: #607591; 
        float: left;
        color: #faf7f6;
        display: block;
        width: 90px;
        text-align: center;
        margin-right: 15px;
       
        }
    }
}
.floor-two-contant{
    width: 1339px;
    height: 474px;
    margin: 0 auto; 
    margin-top: 20px;
    background: #FFFFFF;
    table{width: 1339px;
        height: 474px;
        tr td{ width: 266px;
            border: 1px solid #f1f1f1;
            border-bottom: none;
                div{height: 134px;width: 564;
                    img{display:block;margin: 0 auto;padding-top: 20px;vertical-align: bottom;}}
               div:not(:first-child):hover{
                    animation: pic3 800ms ease-out infinite alternate;
                }
                
                p{font-size: 16px; margin-left: 18px;}
                span{color: #607591;font-size: 12px; margin-left: 18px;}
            } 
           
                .own{vertical-align: top;
                    .floor1{width: 266px;
                             height: 355px;
                            img{width: 100%; height: 100%;padding: 0;}}
               
        }
                .comform{width: 266px;height: 118px; color:#EFEFEF;background: #607591;
            h3{display: block;margin: 0 auto;width: 118px;line-height: 40px;padding-top: 15px;}
           
          }    
    }
}
@keyframes pic1{
                    0% {border-color: #13b1ec;
                        box-shadow: 0 0 5px #66FF66;
                    }   
                    100% {
                        border-color: #38a6eb;
                        box-shadow: 0 0 20px #38ebc3;
    }}

@keyframes pic2{
                    0% {transform: scale(1);
                    border-color: #e73030;
                    box-shadow: 0 0 5px #e51a8d;
                    }   
                    100% {
                       transform: scale(1.2);
                       border-color: #e51a45;
                       box-shadow: 0 0 20px #e024de;
    }}
    
@keyframes pic3{
                    0% {opacity: 0;
                        background:#007AFF;
                        transform: scale(1);
                    border-color: #e73030;
                    box-shadow: 0 0 5px #e51a8d;
                    transform: rotate(10deg);
                    }   
                    100% {
                        opacity: 1;
                        background:transparent;
                       transform: scale(1.2);
                       border-color: #e51a45;
                       box-shadow: 0 0 20px #e024de;
                       transform: rotate(-10deg);
    }}
   

@keyframes pic4{
                    0% {opacity: 0;
                        transform: scale(1);
                         border-color: #e73030;
                         box-shadow: 0 0 5px #e51a8d;
                         transform: translateX(-10px);
                    }   
                    100% {
                        opacity: 1;
                         transform: scale(1.2);
                         border-color: #e51a45;
                         box-shadow: 0 0 20px #e024de;
                          transform: translateX(10px);
                         
    }}